<template>
	<div class="common stock-check">
		<div class="common-top clearfix">
			<div class="left flex flex-align-center" style="height:100%;">
				<span class="tips">仓库盘点</span>
				<div class="change-stock-btn mode">
					<span>商品</span>
					<span :class="modeType=='PRODUCT'?'change-btn':'change-btn right-btn'" @click.stop="changeModeType">
						<i @click.stop=""></i>
					</span>
					<span>原料</span>
				</div>
			</div>
			
			<div class="right flex flex-align-center cord" style="height:100%;margin-right:20px;">
				<div class="search-btn" @click="$router.push('/Stock_Check/record')">
					<span>仓库盘点记录</span>
				</div>
			</div>
		</div>
		<div class="content-box">
			<div class="content scroll-style" v-if="modeType == 'PRODUCT'">
				<div class="titleTable">
					<table style="width:100%" >
	                    <tr>
	                        <th style="width:8%">序号</th>
	                        <th style="width:10.5%">商品名称</th>
	                        <th style="width:10.5%">商品分类</th>
	                        <th style="width:10.5%">规格(个/件)</th>
	                        <th style="width:10.5%">应有件数</th>
	                        <th style="width:10.5%">实际件数</th>
	                        <!-- <th style="width:10.5%">应有散装(个)</th> -->
	                        <!-- <th style="width:10.5%">实际散装(个)</th> -->
	                        <th style="width:10.5%">盈亏件数</th>
	                        <!-- <th style="width:10.5%">盈亏个数(个)</th> -->
	                        <th style="width:8%">备注</th>
	                    </tr>
	                </table>
				</div>
                <div class="scrollBox">
                    <div class="scroll" :style="{'height':homeArr.length*10+'%'}">
                        <table class="conTable">
                            <tr v-for="(item,ind) in homeArr">
                                <td style="width:8%" v-text="ind+1"></td>
                                <td style="width:10.5%" v-text="item.name" :title="item.name"></td>
                                <td style="width:10.5%" v-text="item.typeName" :title="item.typeName"></td>
                                <td style="width:10.5%" >
                                	<span v-if="item.isStock" class="table-input">
										<input type="text" maxlength="4" v-model="item.capacity" @keyup.enter="modify(item,ind,'stock')" onkeyup="this.value=this.value.replace(/\D/g,'')" onafterpaste="this.value=this.value.replace(/\D/g,'')">
										<span @click="modify(item,ind,'stock')" class="sure-btn">确定</span>
									</span>
									<span v-else><span v-text="item.capacity"></span></span>
                                </td>
                                <td style="width:10.5%" v-text="item.quantity"></td>
                                <td style="width:10.5%">
									<span class="table-input">
										<!-- <img src="../../../assets/check_reduce.png" height="18" width="18" alt=""> -->
										<input type="text" maxlength="4" v-model="item.real_quantity"  onfocus="this.select()">
										<!-- <img src="../../../assets/check_add.png" height="18" width="18" alt=""> -->
									</span>
                                </td>
                                <!-- <td style="width:10.5%" v-text="item.counterQuantity"></td> -->
                                <!-- <td style="width:10.5%"> -->
                                	<!-- <span class="table-input"> -->
										<!-- <img src="../../../assets/check_reduce.png" height="18" width="18" alt=""> -->
										<!-- <input type="text" maxlength="4" v-model="item.real_counterQuantity" onfocus="this.select()"> -->
										<!-- <img src="../../../assets/check_add.png" height="18" width="18" alt=""> -->
									<!-- </span> -->
                                <!-- </td> -->
                                <td style="width:10.5%" v-text="(item.real_quantity-item.quantity)>=0?(item.real_quantity-item.quantity):'-'+(item.quantity-item.real_quantity)"></td>
                                <!-- <td style="width:10.5%" v-text="item.real_counterQuantity-item.counterQuantity"></td> -->
                                <td style="width:8%">
									<span style="color: #618bfb;font-size:16px;cursor:pointer;" @click="productNotes= {btn:true,productId:item.id,notes:item.notes,ind:ind,productName:item.productName}" v-text="item.notes?item.notes:'备注'"></span>
									<span class="change-notes" @click="productNotes= {btn:true,productId:item.id,notes:item.notes,ind:ind,productName:item.productName}" v-if="item.notes">修改备注</span>
								</td>
                            </tr>
                        </table>
                    </div>
                </div>
                <div class="content-footer clearfix">
				    <div class="right flex flex-align-center" style="height:100%;">
				    	<!-- <div class="footer-btn black-bg" @click="print">
				    		小票打印
				    	</div> -->
				    	<div class="footer-btn black-bg" @click="excel">
				    		导出数据
				    	</div>
				    	<div class="footer-btn sure" @click="willGoCheck">
				    		盘点
				    	</div>
				    </div>
                </div>
			</div>
			<!--  -->
			<div class="content scroll-style" v-if="modeType == 'MATERIAL'">
				<div class="titleTable">
					<table style="width:100%" >
	                    <tr>
	                        <th style="width:8%">序号</th>
	                        <th style="width:10.5%">原料名称</th>
	                        <th style="width:10.5%">规格</th>
	                        <th style="width:10.5%">单位</th>
	                        <th style="width:10.5%">应有数量</th>
	                        <th style="width:10.5%">实际数量</th>
	                        <!-- <th style="width:10.5%">应有散装(个)</th> -->
	                        <!-- <th style="width:10.5%">实际散装(个)</th> -->
	                        <th style="width:10.5%">盈亏数</th>
	                        <!-- <th style="width:10.5%">盈亏个数(个)</th> -->
	                        <th style="width:8%">备注</th>
	                    </tr>
	                </table>
				</div>
                <div class="scrollBox">
                    <div class="scroll" :style="{'height':homeArr.length*10+'%'}">
                        <table class="conTable">
                            <tr v-for="(item,ind) in homeArr">
                                <td style="width:8%" v-text="ind+1"></td>
                                <td style="width:10.5%" v-text="item.name" :title="item.name"></td>
                                <td style="width:10.5%" >
                                	<span v-if="item.isStock" class="table-input">
										<input type="text" maxlength="4" v-model="item.capacity" @keyup.enter="modify(item,ind,'stock')" onkeyup="this.value=this.value.replace(/\D/g,'')" onafterpaste="this.value=this.value.replace(/\D/g,'')">
										<span @click="modify(item,ind,'stock')" class="sure-btn">确定</span>
									</span>
									<span v-else><span v-text="item.capacity"></span></span>
                                </td>
                                <td style="width:10.5%" v-text="item.unitName" :title="item.unitName"></td>
                                <td style="width:10.5%" v-text="item.quantity"></td>
                                <td style="width:10.5%">
									<span class="table-input">
										<!-- <img src="../../../assets/check_reduce.png" height="18" width="18" alt=""> -->
										<input type="text" maxlength="4" v-model="item.real_quantity"  onfocus="this.select()">
										<!-- <img src="../../../assets/check_add.png" height="18" width="18" alt=""> -->
									</span>
                                </td>
                                <td style="width:10.5%" v-text="(item.real_quantity-item.quantity)>=0?(item.real_quantity-item.quantity):'-'+(item.quantity-item.real_quantity)"></td>
                                <!-- <td style="width:10.5%" v-text="item.real_counterQuantity-item.counterQuantity"></td> -->
                                <td style="width:8%">
									<span style="color: #618bfb;font-size:16px;cursor:pointer;" @click="productNotes= {btn:true,productId:item.id,notes:item.notes,ind:ind,productName:item.productName}" v-text="item.notes?item.notes:'备注'"></span>
									<span class="change-notes" @click="productNotes= {btn:true,productId:item.id,notes:item.notes,ind:ind,productName:item.productName}" v-if="item.notes">修改备注</span>
								</td>
                            </tr>
                        </table>
                    </div>
                </div>
                <div class="content-footer clearfix">
				    <div class="right flex flex-align-center" style="height:100%;">
				    	<!-- <div class="footer-btn black-bg" @click="print">
				    		小票打印
				    	</div> -->
				    	<div class="footer-btn black-bg" @click="excelM">
				    		导出数据
				    	</div>
				    	<div class="footer-btn sure" @click="willGoCheck">
				    		盘点
				    	</div>
				    </div>
                </div>
			</div>
		</div>

		<!-- 单品备注 -->
		<div class="dialog-box" v-if="productNotes.btn" @click="productNotes.btn=false">
			<div class="dialog position-middle-center" @click.stop="">
				<span class="close-btn" @click="productNotes.btn=false"><i class="iconfont icon-close-b"></i></span>
				<div class="dialog-title">备注</div>
				<div class="dialog-content" style="margin-top:20px;">
					<div class="dialog-content-item-center">
						<span>请仔细核对</span>
					</div>
					<div class="dialog-content-item clearfix select-box">
						<span>备注</span>
						<el-input
						 	class="input-box"
						    placeholder="如有需求，请填写备注"
						    v-model="productNotes.notes">
						  </el-input>
					</div>
				</div>
				<div class="dialog-footer">
					<div class="footer-btn cancle" @click="productNotes.btn=false">取消</div>
					<div class="footer-btn sure" @click="notesFn">确定</div>
				</div>
			</div>
		</div>
		<div class="dialog-box" v-if="dialogBtn1" @click="dialogBtn1=false">
			<div class="dialog position-middle-center" @click.stop="" style="width:720px;">
				<span class="close-btn" @click="dialogBtn1=false"><i class="iconfont icon-close-b"></i></span>
				<div class="dialog-title">盘点</div>
				<div class="dialog-content" style="margin-top:20px;height:400px;">
					<div class="dialog-content-title">
						<table style="width:100%;">
							<tr>
								<th style="width:10%">序号</th>
		                        <th style="width:24%">商品名称</th>
		                        <th style="width:16%">应有件数</th>
		                        <th style="width:18%">实际件数</th>
		                        <!-- <th style="width:16%">应有个数(个)</th>
		                        <th style="width:18%">实际个数(个)</th> -->
							</tr>
						</table>
					</div>
					<div class="dialog-scroll">
						<div class="scroll-inner">
							<table style="width:100%;text-align:center;">
								<tr v-for="(item,ind) in willCheckBody.checkInventories" v-if="item.isKind">
	                                <td style="width:10%" v-text="ind+1"></td>
	                                <td style="width:24%" v-text="item.productName"  :title="item.name"></td>
	                                <td style="width:16%" v-text="item.accurateWholeQty"></td>
	                                <td style="width:18%" v-text="item.checkWholeQty"></td>
	                                <!-- <td style="width:18%" v-text="item.accurateSingleQty"></td>
	                                <td style="width:18%" v-text="item.checkSingleQty"></td> -->
	                            </tr>
							</table>
						</div>
					</div>
				</div>
				<div class="dialog-footer clearfix">
					<!-- <div class="footer-btn cancle" @click="dialogBtn=false">取消</div> -->
					<div class="footer-btn sure right" @click="dialogBtn=true">提交数据</div>
				</div>
			</div>
		</div>
		<div class="dialog-box" v-if="dialogBtn" @click="dialogBtn=false">
			<div class="dialog position-middle-center" @click.stop="">
				<span class="close-btn" @click="dialogBtn=false"><i class="iconfont icon-close-b"></i></span>
				<div class="dialog-title">盘点确认</div>
				<div class="dialog-content" style="margin-top:20px;">
					<div class="dialog-content-item-center">
						<span>盈亏种类 <span class="big-num" v-text="billData.kind"></span> 种</span>
					</div>
					<div class="dialog-content-item-center">
						<span>请仔细核对</span>
					</div>
					<div class="dialog-content-item clearfix select-box">
						<span>备注</span>
						<el-input
						 	class="input-box"
						    placeholder="如有需求，请填写备注"
						    v-model="billData.notes">
						  </el-input>
					</div>
				</div>
				<div class="dialog-footer">
					<div class="footer-btn cancle" @click="dialogBtn=false">取消</div>
					<div class="footer-btn sure" @click="stockCheck">确定</div>
				</div>
			</div>
		</div>


		<div style="display:none;">
			<div id="print">
				<h1 style="text-align:center;font-size:18px;">欢迎使用火星捕手</h1>
				<p style="text-align:center;font-size:16px;">仓库盘点小票</p>
		    	<div>
		    		<span>店铺名:</span>
		    		<span v-text="store.storeName"></span>
		    	</div>
		    	<div>
		    		<span>操作员:</span>
		    		<span v-text="store.employeeName"></span>
		    	</div>
				<div>
		    		<span>打印时间:</span>
		    		<span>{{new Date() | numberToAllDate('')}}</span>
		    	</div>
		    	<div style="margin-top:10px;border:1px solid #444">
		    		<table style="width:100%;border-collapse: collapse;table-layout:fixed;font-size:12px;">
		    			<tr>
		    				<td style="width:50%;">名称</td>
		    				<td style="width:22%;text-align:center;">件数</td>
		    				<td style="width:22%;text-align:center;">个数</td>
		    			</tr>
	    				<tr v-for="(item,idx) in homeArr">
	    					<td style="width:50%;overflow:hidden;white-space:nowrap;text-align:left" v-text="item.productName"></td>
	    					<td style="width:22%;text-align:center;" v-text="item.warehouse"></td>
	    					<td style="width:22%;text-align:center;"  v-text="item.counterQuantity"></td>
	    				</tr>
		    		</table>
		    	</div>
			</div>
		</div>

	</div>
</template>

<script>
export default {
  	props:['storeId','store'],
  	data(){
		return {
      		modeType:"PRODUCT",
            billData:{
	        	kind:0,
	        	notes:'',
	        },
	        dialogBtn:false,
	        dialogBtn1:false,
	        productNotes:{
	        	btn:false,
	        	ind:0,
	        	notes:'',
	        	productName:'',
	        	productId:''
	        },
	        homeArr:[],//首页商品列表
	        willCheckBody:{},//将要判断的  body
			preventBtn:true,
		}
	},
	watch:{
	},
	methods:{
		changeModeType(){
			this.homeArr = [];
			this.modeType == "PRODUCT"?this.modeType="MATERIAL":this.modeType="PRODUCT";
			this.getHomeData();
		},
	 	//小票
	    print(){
	    	this.$posPrint(1, document.getElementById("print").innerHTML);
	    },
		notesFn(){
			let localNotes = JSON.parse(sessionStorage.getItem('localNotes'))?JSON.parse(sessionStorage.getItem('localNotes')):[];
			let isNew = true;//是否直接
			let obj={
				notes:'',
				productId:'',
				productName:''
			}
			if(localNotes.length){
				for (var i = 0; i < localNotes.length; i++) {
					if(localNotes[i].productId==this.productNotes.productId){
						obj = {
							notes:this.productNotes.notes,
							productId:this.productNotes.productId,
							productName:this.productNotes.productName
						}
						localNotes[i]=obj;
						isNew = false;
						sessionStorage.setItem('localNotes', JSON.stringify(localNotes));
						this.productNotes.btn = false;
					}
				}
			}
			if(isNew){
				obj = {
					notes:this.productNotes.notes,
					productId:this.productNotes.productId,
					productName:this.productNotes.productName
				};
				localNotes.push(obj);
				sessionStorage.setItem('localNotes', JSON.stringify(localNotes));
				this.productNotes.btn = false;
			}
			this.homeArr[this.productNotes.ind].notes = this.productNotes.notes;
		},
		// 点击盘点
		willGoCheck(){
			console.log(this.homeArr);
			let store = JSON.parse(sessionStorage.getItem('store'));
			this.billData={notes:'',kind:0}
			let body = {
	    		operatorId:store.employeeId,//操作人ID
				operatorName:store.employeeName,//操作人名字
				checkCode:this.$uuid(),//
	    		storeId:this.storeId,//
				kind:this.billData.kind,//
	    		checkInventories:[]//
			};
			for (var i = 0; i < this.homeArr.length; i++) {
				if ( !/^\d+$/.test(this.homeArr[i].real_quantity) ) {
					this.$message({
						showClose: true,
			            message: '请输入正确的  '+this.homeArr[i].name+'  商品件数',
			            type: 'error'
			        })
			        return;
				}
				// if ( !/^\d+$/.test(this.homeArr[i].real_counterQuantity) ) {
				// 	this.$message({
				// 		showClose: true,
			    //         message: '请输入正确的  '+this.homeArr[i].productName+'  商品个数',
			    //         type: 'error'
			    //     })
			    //     return;
				// }

	    		// let newProducts = {
	    		// 	productId:this.homeArr[i].id,
	    		// 	isKind:false,
	    		// 	productName:this.homeArr[i].productName,
	    		// 	// stockPrice:this.homeArr[i].stockPrice*100,
	    		// 	stockQuantityRatio:this.homeArr[i].stockQuantityRatio,
	    		// 	checkSingleQty:parseInt(this.homeArr[i].real_counterQuantity),//实际总个数量
	    		// 	checkWholeQty:parseInt(this.homeArr[i].real_warehouse),//实际总件数量
	    		// 	accurateSingleQty:this.homeArr[i].counterQuantity,//应有个数
	    		// 	accurateWholeQty:this.homeArr[i].warehouse=='-'?0:this.homeArr[i].warehouse,//应有件数
	    		// 	notes:this.homeArr[i].notes
				// };
				let newProducts = {
					invId:this.homeArr[i].idForInv,
					productName:this.homeArr[i].name,
					stockPrice:this.homeArr[i].purchasePrice,
					capacity:this.homeArr[i].capacity,
					checkWholeQty:parseInt(this.homeArr[i].real_quantity),
					accurateWholeQty:this.homeArr[i].quantity,
					notes:this.homeArr[i].notes
	    		};

	    		// if(this.homeArr[i].real_counterQuantity>=this.homeArr[i].counterQuantity){
	    		// 	//实际比应有多=>盘盈总个数量
	    		// 	body.singleProfit += (this.homeArr[i].real_counterQuantity-this.homeArr[i].counterQuantity);
	    		// }else {
	    		// 	//实际比应有少=>盘亏总个数量
	    		// 	body.singleLosses += (this.homeArr[i].counterQuantity-this.homeArr[i].real_counterQuantity);
	    		// };
	    		// if(this.homeArr[i].real_warehouse>=this.homeArr[i].warehouse){
	    		// 	//实际比应有多=>盘盈总件数量
	    		// 	body.wholeProfit += (this.homeArr[i].real_warehouse-this.homeArr[i].warehouse);
	    		// }else {
	    		// 	//实际比应有少=>盘亏总件数量
	    		// 	body.wholeLosses += (this.homeArr[i].warehouse-this.homeArr[i].real_warehouse);
	    		// };
	    		// if(this.homeArr[i].real_quantity!=this.homeArr[i].quantity||this.homeArr[i].real_warehouse!=this.homeArr[i].warehouse){
	    		if(this.homeArr[i].real_quantity!=this.homeArr[i].quantity){
	    			this.billData.kind+=1;
	    			newProducts.isKind = true;
	    		}
	    		if(newProducts.isKind){
	    			body.checkInventories.unshift(newProducts);
	    			// body.checkInventories.push(newProducts);
	    		}else{
	    			body.checkInventories.push(newProducts);
	    		}
	    	}
	    	body.kind=this.billData.kind;//种类
	    	body.mold=this.modeType;//种类
			this.willCheckBody = body;
			console.log(this.willCheckBody)
	    	if(this.billData.kind==0){
	    		this.dialogBtn = true;
	    	}else{
	    		this.dialogBtn1=true;
	    	}
		},
		//发送盘点数据
		stockCheck(){
			if ( !this.preventBtn ) {
                return;
            }
            this.preventBtn = false;
			this.willCheckBody.notes = this.billData.notes;
			this.$http.post('check-in',this.willCheckBody).then((res)=>{
				if(res.data.code === 400){
					this.$message({
						showClose: true,
						message: res.data.msg,
						type: 'error'
					});
					this.preventBtn = true;
					return;
				}
	    		this.$message({
	    			showClose: true,
		            message: '操作成功',
		            type: 'success'
		        })
	    		this.dialogBtn = false;
	    		this.dialogBtn1 = false;
	    		sessionStorage.removeItem('localNotes');
	    		this.getHomeData();
	    		setTimeout(()=>{
	    			this.preventBtn = true;
	    		},1000)
	    	}).catch((err)=>{
				setTimeout(()=>{
	    			this.preventBtn = true;
	    		},1000)
	    	})
		},
	    //获取首页数据
	    getHomeData2(){
	    	this.homeArr = [];
	    	this.$http.get('/warehouse/products?storeId='+this.storeId).then((res)=>{
	    		let data = res.data;
	    		for (var i = 0; i < data.length; i++) {
	    			let obj = {
	    				real_warehouse:data[i].stockQuantityRatio==0?'-':parseInt(data[i].warehouse/data[i].stockQuantityRatio),//实际仓库库存
	    				real_counterQuantity:data[i].stockQuantityRatio==0?data[i].warehouse:data[i].warehouse%data[i].stockQuantityRatio,//实际吧台数量
	    				isStock:false,//规格是否处于修改状态
	    				notes:'',
	    				id:data[i].productId,
	    				productName:data[i].productName,
	    				stockQuantityRatio:data[i].stockQuantityRatio,
	    				allNumber: data[i].warehouse,
	    				counterQuantity:data[i].stockQuantityRatio==0?data[i].warehouse:data[i].warehouse%data[i].stockQuantityRatio,//吧台数量
	    				warehouse:data[i].stockQuantityRatio==0?'-':parseInt(data[i].warehouse/data[i].stockQuantityRatio)//仓库库存
	    			};
	    			//获取本地的备注信息
	    			let localNote = JSON.parse(sessionStorage.getItem('localNotes'))?JSON.parse(sessionStorage.getItem('localNotes')):[];
					if(localNote.length){
						for (var j = 0; j < localNote.length; j++) {
							if(obj.id==localNote[j].productId){
								obj.notes = localNote[j].notes;
							}
						}
					}
	    			this.homeArr.push(obj);
	    		}
	    	})
		},
		//获取首页数据
	    getHomeData(){
	    	this.homeArr = [];
	    	this.$http.get('/findAll-check?id='+this.storeId+"&mold="+this.modeType).then((res)=>{
				let data = res.data;
				console.log(data);
	    		for (var i = 0; i < data.length; i++) {
	    			let obj = {
	    				// real_warehouse:data[i].stockQuantityRatio==0?'-':parseInt(data[i].warehouse/data[i].stockQuantityRatio),//实际仓库库存
	    				// real_counterQuantity:data[i].stockQuantityRatio==0?data[i].warehouse:data[i].warehouse%data[i].stockQuantityRatio,//实际吧台数量
	    				isStock:false,//规格是否处于修改状态
	    				notes:'',
						id:data[i].productId,
						idForInv:data[i].id,
	    				name:data[i].name,
	    				typeName:data[i].typeName,
	    				capacity:data[i].capacity,
						quantity: data[i].quantity,
						real_quantity:data[i].quantity,
						purchasePrice:data[i].purchasePrice,
						unitName:data[i].unitName,
	    				// counterQuantity:data[i].stockQuantityRatio==0?data[i].warehouse:data[i].warehouse%data[i].stockQuantityRatio,//吧台数量
	    				// warehouse:data[i].stockQuantityRatio==0?'-':parseInt(data[i].warehouse/data[i].stockQuantityRatio)//仓库库存
	    			};
	    			//获取本地的备注信息
	    			let localNote = JSON.parse(sessionStorage.getItem('localNotes'))?JSON.parse(sessionStorage.getItem('localNotes')):[];
					if(localNote.length){
						for (var j = 0; j < localNote.length; j++) {
							if(obj.id==localNote[j].productId){
								obj.notes = localNote[j].notes;
							}
						}
					}
	    			this.homeArr.push(obj);
	    		}
	    	})
	    },
	    //警告修改规格
	    willModify(stockQuantityRatio,ind){
	    	if(stockQuantityRatio==0){
	    		this.homeArr[ind].isStock=true;
	    		return;
	    	};
	    	this.$confirm('此操作会导致数据错误,建议新建商品！', '谨慎操作', {
	         	confirmButtonText: '取消',
	          	cancelButtonText: '去修改',
	          	type: 'error'
	        }).then(() => {
	        }).catch(() => {
	        	this.homeArr[ind].isStock=true
	        });
	    },
	    //修改规格
	    modify(item,ind){
    		this.$http.post('/modify-format',{productId:item.id,stockQuantityRatio:item.stockQuantityRatio}).then((res)=>{
    			this.homeArr[ind].isStock = false;
    			item.warehouse = parseInt(item.allNumber/item.stockQuantityRatio);//仓库库存
    			item.counterQuantity = item.allNumber%item.stockQuantityRatio;//吧台数量
    			item.real_warehouse = item.warehouse;
    			item.real_counterQuantity = item.counterQuantity;
    			this.$message({
    				showClose: true,
		            message: '修改成功',
		            type: 'success'
		        })
    		})
	    },
	    //数据导出
	    excel(){
	    	let data = this.homeArr;
            let html =  '<tr  style="font-size:18px;font-weight:900;text-align:center">'+  
                            '<td>商品名称</td>'+
                            '<td>商品规格(个/件)</td>'+
                            '<td>应有库存(件)</td>'+ 
                            '<td>实际库存(件)</td>'+
                        '</tr>'
            for(var i=0;i<data.length;i++){
                html  +='<tr  style="font-size:14px;text-align:center">'+
                            '<td>'+data[i].name+'</td>'+ 
                            '<td>'+data[i].capacity+'</td>'+ 
                            '<td>'+data[i].quantity+'</td>'+ 
                            '<td>'+data[i].quantity+'</td>'+ 
                        '</tr>'
            }
            let table = document.createElement('table');
            document.body.appendChild(table)
            table.style.display='none';
            // table.style.borderCollapse='collapse';
        	table.innerHTML = html;
            window.method5(table);
	    },
		 excelM(){
	    	let data = this.homeArr;
            let html =  '<tr  style="font-size:18px;font-weight:900;text-align:center">'+  
                            '<td>原料名称</td>'+
                            '<td>规格</td>'+
                            '<td>单位</td>'+
                            '<td>应有库存</td>'+ 
                            '<td>实际库存</td>'+
                        '</tr>'
            for(var i=0;i<data.length;i++){
                html  +='<tr  style="font-size:14px;text-align:center">'+
                            '<td>'+data[i].name+'</td>'+ 
                            '<td>'+data[i].capacity+'</td>'+ 
                            '<td>'+data[i].unitName+'</td>'+ 
                            '<td>'+data[i].quantity+'</td>'+ 
                            '<td>'+data[i].quantity+'</td>'+ 
                        '</tr>'
            }
            let table = document.createElement('table');
            document.body.appendChild(table)
            table.style.display='none';
            // table.style.borderCollapse='collapse';
        	table.innerHTML = html;
            window.method5(table);
	    }
	},
	created () {
		this.getHomeData();
	},
	mounted() {
	},
	beforeDestroy() {
		sessionStorage.removeItem('localNotes');
	}
}
</script>
<style lang="scss" scoped>
	@import '../../../../static/css/common.scss';
	@import "check";
</style>